// 导入 vue
import Vue from 'vue'
// 导入 vuex
import Vuex from 'vuex'
import user from './modules/user'
import setting from './modules/setting'
// vuex也是vue的插件, 需要use一下, 进行插件的安装初始化
Vue.use(Vuex)

// 创建仓库 store
const store = new Vuex.Store({
  strict: true,
  // state 状态, 即数据, 类似于vue组件中的data,
  // 区别：
  // 1.data 是组件自己的数据,
  // 2.state 中的数据整个vue项目的组件都能访问到
  state: {
    title: '仓库大标题',
    count: 101,
    list: [1, 2, 3, 4, 5, 6, 7, 8, 9, 10]
  },
  // 定义mutations
  mutations: {
    // 方法里参数 第一个参数是当前store的state属性
    // payload 载荷 运输参数 调用mutaiions的时候 可以传递参数 传递载荷
    // addCount(state) {
    //   state.count += 1
    // }
    addCount(state, count) {
      state.count += count
    },
    addCount2(state, obj) {
      state.count += obj.count
    },

    subCount(state, n) {
      state.count -= n
    },
    changeCount(state, newCount) {
      state.count = newCount
    },
    changeTitle(state, newTitle) {
      state.title = newTitle
    }
  },
  actions: {
    changeCountAction(context, num) {
      // 一秒后, 给一个数, 去修改 num
      setTimeout(() => {
        context.commit('changeCount', num)
      }, 1000)
    }
  },
  // 4. getters 类似于计算属性
  getters: {
    // 注意点：
    // 1. 形参第一个参数，就是state
    // 2. 必须有返回值，返回值就是getters的值
    filterList(state) {
      return state.list.filter(item => item > 5)
    }
  },
  // 5. modules 模块
  modules: {
    user,
    setting
  }
})

// 导出仓库
export default store
